<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport"
			content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">

		<!--引入 element-ui 的样式，-->
		<link rel="stylesheet" href="/admin/plugin/element-ui/index.css">
		<!-- 必须先引入vue，  后使用element-ui -->
		<script type="text/javascript" src="/admin/js-css/js/vue.min.js"></script>
		<!-- 引入element 的组件库-->
		<script type="text/javascript" src="/admin/plugin/element-ui/index.js"></script>

		<script type="text/javascript" src="/admin/plugin/element-ui/httpVueLoader.js"></script>

		<!--引入layui组件-->
		<link rel="stylesheet" href="/admin/plugin/layui/dist/css/layui.css"
			tppabs="http://res.layui.com/layui/dist/css/layui.css" media="all">
		<script src="/admin/plugin/layui/dist/layui.js" charset="utf-8"></script>
		<link rel="stylesheet" href="/admin/js-css/css/backColor.css" media="all">

		<script type="text/javascript" src="/admin/js-css/js/jquery-1.7.2.min.js"></script>
		<script type="text/javascript" src="/admin/js-css/js/mx1.0.js?v=1.3"></script>

		<link rel="stylesheet" href="/admin/js-css/css/main.css?v=1.1">
		<link rel="icon" href="/admin/js-css/img/logo.png">

		<style>
			.el-card__body,
			.el-main {
				padding: 10px;
			}

			/*原来的背景颜色#dfefff*/
			body {
				background: #f5f7fa;
			}

			.el-submenu {
				font-weight: normal;
			}

			.messageIndex {
				z-index: 29891014 !important; // 设置的值一定要比2007大，因为dialog的层级是2007
			}



			/**右下角弹窗样式**/
			.notifyList {
				padding: 10px;
				font-size: 14px;
				height: 210px;
				overflow: auto;
				width: 320px;
				font-weight: normal;
			}

			.el-notification__title {
				font-weight: normal;
			}

			.el-notification__content {
				text-align: left;
			}
		</style>
	</head>

	<body>
		<div id="app">
			<title>{{systemTitle}}</title>
			<el-container>
				<el-aside width="auto">
					<el-menu :default-active="clickMenuId"  :unique-opened="true" ref="menu" :collapse="isCollapse"
						class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose" background-color="#304156"
						text-color="#C0D2DC" active-text-color="#409eff">
						<!-- 菜单头部LOGO -->
						<h4>
							<img class="logoImg" :src="logo" v-if="systemTitle.length<=10" />
							<span v-if="!isCollapse" style="font-weight: 700;font-size: 12px;">{{systemTitle}}</span>
						</h4>

						<template v-for="(item,index) in menus">
							<el-menu-item :index="item.id" v-if="item.childs.length == 0" @click="openlink(item,item)">
								<i :class="item.icon_path"></i>
								<span slot="title">{{item.name}}</span>
							</el-menu-item>

							<el-submenu :index="item.id" v-if="item.childs.length > 0">
								<template slot="title">
									<i :class="item.icon_path"></i>
									<span>{{item.name}}</span>
								</template>

								<el-menu-item :index="itemsub.id" v-for="(itemsub,index1) in item.childs"
											  @click="openlink(item,itemsub)">
									<i :class="itemsub.icon_path"></i>
									<span>{{itemsub.name}}</span>
								</el-menu-item>

							</el-submenu>

						</template>

					</el-menu>

				</el-aside>
				<el-container>
					<el-header>
						<header>
							<!-- 左侧标题及横向菜单 -->
							<div class="l-content">
								<div class="open-menu-btn" @click="handleMenu">
									<i v-if="isCollapse" class="el-icon-s-unfold"></i>
									<i v-else class="el-icon-s-fold"></i>
								</div>
								<el-breadcrumb separator="/">
									<el-breadcrumb-item :to="{ path: '/admin/html/main.html' }">首页</el-breadcrumb-item>
									<el-breadcrumb-item
										v-if="breadcrumb.one!=''">{{breadcrumb.one}}</el-breadcrumb-item>
									<el-breadcrumb-item
										v-if="breadcrumb.two!=''">{{breadcrumb.two}}</el-breadcrumb-item>
									<el-breadcrumb-item
										v-if="breadcrumb.three!=''">{{breadcrumb.three}}</el-breadcrumb-item>
								</el-breadcrumb>
							</div>

							<!-- 右侧头像部分 -->
							<div class="r-content">
								<el-dropdown trigger="click" size="small">
									<div style="display: flex;">
										<span>
											<img src="/admin/js-css/img/skin_/userface.png" class="user" />
										</span>
										<span style="line-height: 40px;margin-left: 10px;cursor:pointer;">
											{{user.user_name}}
										</span>
									</div>
									<el-dropdown-menu slot="dropdown">
										<el-dropdown-item onclick="f_pass()">修改密码</el-dropdown-item>
										<el-dropdown-item onclick="logout()">退出</el-dropdown-item>
									</el-dropdown-menu>
								</el-dropdown>
							</div>
						</header>
					</el-header>

					<!-- tag标签 -->
					<div class="tags">
						<el-tag size="small" :type="item.type" v-for="(item, index) in tagList" :key="item.name"
							:closable="item.name !== 'home'" :effect="currentTag === index? 'dark':'plain'"
							@click="changeTag(item,index)" @close="handleCloseTag(item,index)">
							{{item.label}}
						</el-tag>
					</div>

					<!-- 主要内容区域 -->
					<el-main>
						<iframe :src="mineurl" frameborder="0"></iframe>
					</el-main>
				</el-container>
			</el-container>


			<div>
				<el-dialog v-if="dialogData.dialogVisible"
						:title="dialogData.title"
						:close-on-click-modal="false"
						   top="5vh"
						:visible.sync="dialogData.dialogVisible"
						:width="dialogData.width" >
					<div :style="'height: '+dialogData.height+';overflow: auto;padding: 1px 3px;'" >
						<inputcommon ref="inputcommon" :tableid="dialogData.tableId" :id="dialogData.id" :mapod="dialogData.mapod" :inline="dialogData.inline"
						></inputcommon>
					</div>
					<span slot="footer" class="dialog-footer">
						<el-button size="mini" @click="dialogData.dialogVisible = false">取 消</el-button>
						<el-button size="mini" type="primary" @click="dialogsubmit">确 定</el-button>
					</span>
				</el-dialog>
			</div>

		</div>

	</body>

	<script>
		var vm = new Vue({
			el: '#app',
			components: {
				"inputcommon" : httpVueLoader("/admin/html/components/input.vue")
			},
			data: function() {
				return {
					//弹出框属性
					dialogData:{
						dialogVisible : false,
						title:"",
						width:"",
						height:"",
						id:"",
						mapod:"",
						tableId:"",
						call:"",
						inline:true
					},
					systemTitle: "总后台管理平台",
					logo: "/admin/js-css/img/skin_/loginlogo.png",
					visible: false,
					isCollapse: false,
					activeIndex: '1',
					breadcrumb: {
						one: "欢迎进入",
						two: "",
						three: ""
					},
					menus: [],
					user: {},
					tagList: [{
						id: "home",
						name: "home",
						label: "首页",
						type: 'primary',
						item: {
							name: "首页"
						},
						itemsub: {
							name: "",
							id: "home",
							list_url: "/admin/html/welcome_not.html"
						}
					}],
					iframeList: [], //操作区集合URL
					currentTag: 0,
					mineurl: "/admin/html/welcome_not.html",
					clickMenuId: "",
					notifyHtml: "",
					notifyObj: {},
					notifyIsShow: false,
				}
			},
			created() {
				this.getLeftMenus();
				this.user = JSON.parse(localStorage.getItem("user"));
				if (this.user.org_name != "" && this.user.org_name != undefined) {
					this.systemTitle = this.user.org_name;
				}
				if (this.user.atth_path != "" && this.user.atth_path != undefined) {
					this.logo = this.user.atth_path;
				}
				this.getWelcom();
				// this.isLogin();
				this.openNotify();


				/*window.setInterval(async function() {
					const res1 = await postBody("/admin/api/DataManagementController/notifyMessage", {});
					if (res1.code == 1) {
						vm.notifyHtml = res1.data;
						$(".el-notification__content").html("<p>" + vm.notifyHtml + "</p>");
						if (!vm.notifyIsShow) {
							try {
								vm.notifyObj.close();
							} catch (e) {}
							vm.openNotify();
						}
					} else if (vm.notifyHtml == "" || res1.code == 0) {
						if (vm.notifyIsShow) {
							try {
								vm.notifyObj.close();
							} catch (e) {}
							vm.notifyIsShow = false;
						}
					}
				}, 2000);*/
			},
			methods: {
				/**
				 * elementui弹框
				 * @param tableId 表ID
				 * @param width 宽度
				 * @param height 高度
				 * @param title 标题
				 * @param id 数据渲染 查询数据的ID
				 * @param mapod 渲染数据 如果传了ID，这个就可以不传，传空字符串
				 * @param inline 是否为行内表单
				 * @param call 回调方法
				 */
				open(config){
					if(config.tableId == undefined){
						alert({code:0,msg:"表ID不能为空！"});
						return ;
					}
					if(config.title == undefined){
						config.title = "提示";
					}
					if(config.width == undefined || config.width == ""){
						config.width = "70%";
					}
					if(config.height == undefined || config.height == ""){
						config.height = "60vh";
					}
					if(config.id == undefined){
						config.id = "";
					}
					if(config.mapod == undefined){
						config.mapod = "";
					}
					if(config.call == undefined){
						alert({code:0,msg:"回调函数call不能为空！"});
						return ;
					}
					if(config.inline == undefined){
						config.inline = false;
					}
					this.dialogData.dialogVisible = true;
					this.dialogData.tableId = config.tableId;
					this.dialogData.title = config.title;
					this.dialogData.width = config.width;
					this.dialogData.height = config.height;
					this.dialogData.id = config.id;
					this.dialogData.mapod = config.mapod;
					this.dialogData.call = config.call;
					this.dialogData.inline = config.inline;

				},
				close(){
					this.dialogData.dialogVisible = false;
				},
				//弹框提交按钮事件执行
				async dialogsubmit(){
					let mapod = await vm.$refs.inputcommon.getInputData();
					if(!mapod){
						return;
					}
					this.dialogData.call(mapod,this.dialogData);
				},
				//获取共公弹框中录入的数据
				getCommonInputData(){
					return vm.$refs.inputcommon.formInline;
				},
				//打开右下角弹窗
				async openNotify() {
					const res1 = await postBody("/admin/api/DataManagementController/notifyMessage", {});
					if (res1.code == 1 && res1.data != "") {
						this.notifyHtml = res1.data;
						this.notifyObj = this.$notify({
							title: '待办事项',
							dangerouslyUseHTMLString: true,
							position: 'bottom-right',
							duration: 0,
							message: this.notifyHtml,
							customClass: 'notifyList'
						});
						this.notifyIsShow = true;
					}

				},

				//查询左侧菜单
				async getLeftMenus() {
					const res = await post("/admin/api/DataManagementController/getMenus", {});
					if (res.code == 0) {
						window.location.href = "login.html"
					}
					this.menus = res.data;
					//默认打开一级菜单
					this.$nextTick(function() {
						if (vm.menus.length > 0) {
							try {
								vm.$refs.menu.open(vm.menus[0].id);
							} catch (e) {}
						}

					});

				},
				async isLogin() {
					const res = await post("/admin/api/UserController/isLogin", {});
					if (res.code == 1) {
						this.isLogin();
						return;
					}
					layer.confirm('当前帐号在另外一台设备登录或登录失效，导致当前帐户退出，是否需要重新登录？', {
						btn: ['确定', '取消'] //可以无限个按钮
					}, function(index, layero) {
						window.location.href = "login.html";
					}, function(index) {
						//按钮【按钮二】的回调
					});
				},
				//获取主页面数据
				async getWelcom() {
					const res1 = await postBody("/admin/api/DataManagementController/isWelcompage", {});
					if (res1.code == 1) {
						this.mineurl = "/admin/html/welcome.html";
						this.tagList[0].itemsub.list_url = this.mineurl;
					}
				},
				getBreadcrumb() {
					return this.breadcrumb;
				},
				setBreadcrumb(item) {
					this.breadcrumb = item;
				},
				openlink(item, itemsub) {
					this.breadcrumb.one = item.name;
					this.breadcrumb.two = itemsub.name;
					this.breadcrumb.three = "";
					this.clickMenuId = itemsub.id;
					let isadd = true;
					for (let a = 0; a < this.tagList.length; a++) {
						if (this.tagList[a].name == itemsub.id) {
							this.currentTag = a;
							isadd = false;
						}
					}

					top.data.param = {
						ids: ""
					};
					//alert(treeNode.id + ", " + treeNode.name+ ", "+treeNode.code);
					top.data.zygl_id = itemsub.id;
					top.data.tableId = itemsub.id;
					top.data.orderCol = itemsub.order_col;
					top.data.inputurl = itemsub.url;
					top.data.treeObj = itemsub;
					top.data.treeNodeObj = {
						tableId: itemsub.id,
						id: itemsub.id,
						type: "0",
						inputurl: itemsub.url,
						orderCol: itemsub.order_col
					};
					let openurl = "/admin/html/dataManagement/list.html?v=" + guid();
					if (itemsub.list_url != "") {
						if (itemsub.list_url.indexOf("?") != -1) {
							openurl = itemsub.list_url + "&v=" + guid();
						} else {
							openurl = itemsub.list_url + "?v=" + guid();
						}

					}
					//打开链接
					if (!itemsub.isbingding) {
						this.mineurl = openurl;
					} else {
						this.mineurl = "/admin/html/content.html?v=" + guid();
					}

					//添加tag标签
					let tag = {
						name: itemsub.id,
						label: itemsub.name,
						type: 'primary',
						url: openurl,
						itemsub: itemsub,
						item: item
					};
					if (isadd) {
						this.tagList.push(tag)
						this.currentTag = this.tagList.length - 1;
					}
				},

				// 监听左侧菜单
				handleOpen(key, keyPath) {
					console.log(key, keyPath);
				},
				handleClose(key, keyPath) {
					console.log(key, keyPath);
				},
				// 控制左侧菜单开合
				handleMenu() {
					this.isCollapse = !this.isCollapse;
				},
				// 监听顶部菜单
				handleSelect(key, keyPath) {
					console.log(key, keyPath);
				},
				// 点击触发
				changeTag(item, index) {
					this.currentTag = index;
					this.openlink(item.item, item.itemsub);
				},
				// 关闭时触发
				handleCloseTag(item, index) {
					this.tagList.splice(index, 1);
					if (index == this.currentTag) {
						this.currentTag = index - 1;
						this.openlink(this.tagList[this.currentTag].item, this.tagList[this.currentTag].itemsub);
					}
					if (this.currentTag >= this.tagList.length) {
						this.currentTag = this.tagList.length - 1;
					}
				}
			}
		})


		function openDialog(config){
			vm.open(config);
		}

		function closeDialog(){
			vm.close();
		}

		function logout() {
			post("/admin/api/UserController/logout", {}, function(res) {
				let login_html = localStorage.getItem("login_html");
				if (login_html == undefined || login_html == "") {
					window.location.href = "/admin/html/login.html";
				} else {
					window.location.href = login_html;
				}
			})

		}

		function f_pass() {
			f_layer_open_get("/admin/html/pass/input.html", "40%", "40%", null, null, "修改密码", null);
		}


		function f_layer_open(url, width, height, closeFun, buttons, title, parms) {
			if (width == "") {
				width = "60%";
			}
			if (height == "") {
				height = "90%";
			}
			var layer_id = "" + new Date().getTime();
			var config = {
				id: layer_id,
				type: 2,
				title: title,
				area: [width, height],
				fixed: false, //不固定
				maxmin: true,
				content: "about:blank",
				end: function() {
					if (closeFun) {
						closeFun();
					}
				},
				cancel: function() {
					var index = layer.getFrameIndex(layer_id); //先得到当前iframe层的索引
					layer.close(index);
					return true;
				}
			};
			if (buttons) {
				copy(buttons, config);
			}

			//iframe层-父子操作
			layer.open(config);
			f_post_submit(layer_id, parms, url);


		}


		function f_post_submit(layer_id, parms, url) {
			var win = getTopIframe($("#" + layer_id));
			$("#form_submit").attr("target", win.name);
			$("#form_submit").attr("action", url);
			var hidden = "";
			for (var k in parms) {
				hidden = hidden + "<input type=\"hidden\" name=\"" + k + "\" value=\"" + parms[k] + "\" />";
			}
			hidden = hidden + "<input type=\"hidden\" name=\"layer_id\" value=\"" + layer_id + "\" />";
			$("#form_submit").html(hidden);
			$("#form_submit").submit();
		}


		function f_layer_open_get(url, width, height, closeFun, buttons, title, formData) {
			if (width == "") {
				width = "60%";
			}
			if (height == "") {
				height = "90%";
			}
			var layer_id = "" + new Date().getTime();
			var config = {
				id: layer_id,
				type: 2,
				offset: '25px',
				title: title,
				area: [width, height],
				fixed: false, //不固定
				maxmin: true,
				content: url,
				success: function(layero, index) {
					if (formData) {
						try {
							var body = layer.getChildFrame('body', index);
							var iframeWin = window[layero.find('iframe')[0][
								'name'
							]]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();
							iframeWin.setData(formData);
						} catch (e) {}
					}
					layero.find('.layui-layer-min').remove();
				},
				end: function() {
					if (closeFun) {
						closeFun();
					}
				},
				cancel: function() {
					var index = layer.getFrameIndex(layer_id); //先得到当前iframe层的索引
					layer.close(index);
					return true;
				}
			};
			if (buttons) {
				copy(buttons, config);
			}

			//iframe层-父子操作
			layer.open(config);

		}

		async function callLocal(index, layero, tvs) {
			//按钮【按钮一】的回调
			let win = getTopIframe(layero);
			let data = win.getData();
			let i = load();
			let res = await postWebCustom(getTableId(tvs[1]), data);
			layer.close(i);
			if (res.code == 1) {
				const res1 = await postBody("/admin/api/DataManagementController/notifyMessage", {});
				if (res1.code == 1 && res1.data != "") {
					vm.notifyHtml = res1.data;
					$(".el-notification__content").html("<p>" + vm.notifyHtml + "</p>");
				} else if (vm.notifyHtml == "") {
					vm.notifyObj.close();
				}
				top.layer.closeAll();
			} else {
				alert(res.msg);
				return false;
			}
			alert(res.msg);
		}

		async function postCallLocal(index, layero, tvs) {
			if (tvs.length == 3) { //打开弹窗
				let btn = {
					btn: ['确定', '取消'],
					yes: function(index, layero) {
						callLocal(index, layero, tvs);
					},
					btn2: function(index, layero) {
						//按钮【按钮二】的回调
						//return false 开启该代码可禁止点击该按钮关闭
					}
				};

				top.f_layer_open_get(tvs[2], "70%", "85%", function() {

				}, btn, "待办事项数据处理");
			} else if (tvs.length == 2) {
				callLocal(index, layero, tvs);
			} else {
				layer.closeAll();
			}

		}


		/**右下角弹窗点击事件**/
		function notifyClickOpenurl(url, buttons) {
			let btn = {};
			if (buttons) {
				btn.btn = [];
				let btnname = buttons.split(",");
				for (let a = 0; a < btnname.length; a++) {
					let tvs = btnname[a].split("@");
					btn.btn.push(tvs[0]);
					if (a == 0) {
						btn["yes"] = function(index, layero) {
							//按钮【按钮一】的回调
							postCallLocal(index, layero, tvs);
							return false;
						}
					} else {
						let b = a + 1;
						btn["btn" + b] = function(index, layero) {
							postCallLocal(index, layero, tvs);
							return false;
						}
					}
				}
			}

			top.data.other = {};
			top.f_layer_open_get(url, "90%", "90%", function() {

			}, btn, "待办事项处理");
		}


		function close(i) {
			if (i != undefined && i != null) {
				layer.close(i);
			} else {
				layer.closeAll();
			}
		}

		function alert(res) {
			if (res.code == 1) {
				vm.$message({
					type: 'success',
					message: res.msg,
					customClass: 'messageIndex'
				});
			} else if (res.code == 0) {
				vm.$message({
					type: 'error',
					message: res.msg,
					customClass: 'messageIndex'
				});
			} else {
				vm.$message({
					type: 'success',
					message: res,
					customClass: 'messageIndex'
				});
			}

		}

		function error(msg) {
			vm.$message({
				type: 'error',
				message: msg,
				customClass: 'messageIndex'
			});
		}

		var data = {

		};
	</script>

</html>